<template>
  <a-modal :title="title" :width="1200" :visible="visible" :confirmLoading="confirmLoading" switchFullscreen @ok="handleOk" @cancel="handleCancel" cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-row>
        <a-col :span="12">
          <ul class="list">
            <li>基础信息</li>
            <li><span>工号:</span><span>{{ record.workNo }}</span></li>
            <li><span>姓名:</span><span>{{ record.realname }}</span></li>
            <li><span>归属部门:</span><span>{{ record.departName }}</span></li>
            <li><span>岗位:</span><span>{{ record.roleName }}</span></li>
            <li><span>备注:</span><span>{{ record.remark }}</span></li>

          </ul>
        </a-col>
        <a-col :span="12">
          <ul class="list">
            <li>绩效设置</li>
            <li><span>岗位薪资:</span><span>{{ postPerformance }}</span></li>
            <li><span>固定薪资:</span><span>{{ record.fixType == 2 ? '0' : record.fixSalary }}</span></li>
            <li><span>基础薪资:</span><span>{{ record.performanceValue }}</span></li>
          </ul>

        </a-col>
      </a-row>
    </a-spin>

  </a-modal>
</template>
<script>
import { getAction, httpAction } from '@/api/manage'
import pick from 'lodash.pick'
import moment from 'moment'
import { validateDuplicateValue } from '@/utils/util'

export default {
  name: 'UserPerDetailModal',
  data() {
    return {
      record: {},
      title: '员工信息',
      visible: false,
      postPerformance: '',
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      form: this.$form.createForm(this),
      confirmLoading: false,
    }
  },
  methods: {
    edit(record) {
      this.postPerformance = ''
      this.record = record
      this.visible = true
      if (this.record.performanceType == null) {
        this.record.performanceType = 1
      }
      if (this.record.value == null) {
        this.record.value = 0
      }

      var list = this.record.performanceConfigModelList

      for (var i = 0; i <= list.length - 1; i++) {
        if (list[i].isSelect) {
          this.postPerformance = this.postPerformance + list[i].name + '(' + list[i].score + ')' + '  '
        }
      }
    },
    close() {
      this.$emit('close')
      this.visible = false
    },

    handleOk() {
      this.$emit('close')
      this.visible = false
    },
    handleCancel() {
      this.close()
    },
  },
  created() {},
}
</script>

<style lang="less" scoped>
.list {
  padding-left: 0;
  position: relative;
  li {
    list-style: none;
  }
  li:nth-child(1) {
    color: #333;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  li:not(:first-child) {
    margin-left: 15px;
    line-height: 30px;

    span:nth-child(1) {
      color: #333;
      min-width: 70px;
      display: inline-block;
    }

    span:nth-child(2) {
      color: #bfbfbf;
    }
  }
}
</style>
